<template>
  <div>
    <a-card :bordered="false" style=" margin-bottom: 10px">
      <div style="display: flex">
        <div style="width: 3%;">
          <img src="./img/img1.png" alt="" style="margin-top: 7px">
        </div>

        <div style="width: 86%">
          <span style="font-size: 25px;font-weight: 800">{{ propsData.personPhone }}/</span>
          <span style="font-size: 20px">{{ propsData.discoveryLocation }}</span>
          <span style="margin: 0 20px"><a-tag>{{ labelFun(propsData.label) }}</a-tag></span>
          <span>任务编号：</span><a>{{ propsData.taskNumber }}</a>
          <div style="margin: 5px 0">
            <a-alert message="Warning" type="warning" show-icon />
          </div>
          <div>
            <a-descriptions :column="4">
              <a-descriptions-item label="姓名">
                {{ propsData.personNameCode }}
              </a-descriptions-item>
              <a-descriptions-item label="年龄">
                {{ propsData.personAge }}
              </a-descriptions-item>
              <a-descriptions-item label="身份证号">
                {{ propsData.identityNumber }}
              </a-descriptions-item>
              <a-descriptions-item label="情报状态">
                <span style="color: #00DB00" v-if="propsData.intelligenceStatus === 2" >已研判</span>
                <span style="color: red" v-else >未研判</span>
              </a-descriptions-item>
              <a-descriptions-item label="团伙名称">
                {{ propsData.teamName }}
              </a-descriptions-item>
              <a-descriptions-item label="推送时间">
                {{ propsData.intelligencePushTime }}
              </a-descriptions-item>
              <a-descriptions-item label="发现位置">
                {{ propsData.discoveryLocation }}
              </a-descriptions-item>
            </a-descriptions>
          </div>
        </div>

        <div style="width: 11%;display: flex;justify-content: center;">
          <a-button type="primary" style="margin: 20px 0 0 0;">发起案事件</a-button>
        </div>
      </div>

    </a-card>
    <a-card :bordered="false" style=" margin-bottom: 10px">

      <mingwenXQList></mingwenXQList>
    </a-card>
    <a-card :bordered="false" style=" margin-bottom: 10px">

      <mingwenXQList1></mingwenXQList1>
    </a-card>
    <a-card :bordered="false" style=" margin-bottom: 10px">

      <mingwenXQList2></mingwenXQList2>
    </a-card>
  </div>
</template>

<script>
import mingwenXQList from "@views/wxSmuggle/intelligence/mingwen/mingwenXQList";
import mingwenXQList1 from "@views/wxSmuggle/intelligence/mingwen/mingwenXQList1";
import mingwenXQList2 from "@views/wxSmuggle/intelligence/mingwen/mingwenXQList2";
import {getPerson} from "@api/wxSmuggle/intelligence";
export default {
  name: "mingwenXQ",
  components:{
    mingwenXQList,
    mingwenXQList1,
    mingwenXQList2
  },
  data(){
    return {
      record:{},
      propsData:{}
    }
  },
  activated() {

  },
  mounted() {
    this.record = this.$route.query.records
    this.refreshTable()
    console.log(this.$route.query)
    console.log(this.record)
  },
  watch: {
    $route: { // 监听路由的参数变化
      handler () { // 数据变化更新数据
        this.record = this.$route.query.records
        this.refreshTable()
      },
      immediate: true // 立即执行
    }
  },
  methods:{
    refreshTable(){
      getPerson({id: this.record}).then(ser => {
        console.log(ser)
        this.propsData = ser
      })
    },
    labelFun(val){
      if(val === 1){
        return '特别关注'
      } else if (val === 2){
        return '异常入琼'
      } else if(val === 3){
        return '信息异常'
      } else {
        return '首次入琼'
      }
    }
  }
}
</script>

<style scoped>

</style>